<% content_for :javascript_link_tags do %>
<%= javascript_include_tag ['/assets/moment.min.js',
                            '/assets/bootstrap-notify.js',
                            '/assets/backbone.paginator.js',
                            '/assets/admin/models/item.js',
                            '/assets/admin/collections/paginated_collection.js',
                            '/assets/admin/views/result_view.js',
                            '/assets/admin/views/pagination_view.js',
                            '/assets/admin/views/list_view.js',
                            '/assets/admin/controllers/host_nodes/search_controller.js'
]
%>
<% end %>

<% content_for :stylesheet_link_tags do %>
<%= stylesheet_link_tag ['/assets/bootstrap-notify.css',
                         '/assets/smoothness/jquery-ui-1.8.23.custom.css',
                         '/assets/jquery-ui-timepicker-addon.css'
] %>
<% end %>
<div id="notify" class='notifications top-right'></div>
  <div class="span9">
    <div class="control-group">
      <legend>ホストノード検索</legend>
    </div>
    <form class="well form-search">
      <div class="control-group">
         <div class="controls">
         <label class="control-label" for="inputSearch">検索条件</label>
         <input type="text" id="inputSearch" placeholder="" name="q">
         <span style="margin:30px">
         <label class="control-label" for="selectStatus">状態</label>
         <select id="selectStatus" name="status">
           <option>online</option>
           <option>offline</option>
         </select>
         </span>
         </div>
      </div>
      <div class="controls" style="text-align:right">
        <button type="submit" class="btn">検索</button>
      </div>
    </form>

    <div class="controls">
      <legend>検索結果</legend>
    </div>

    <div id="pagination"></div>
    <!--  The pagination is mapped on #tmpServerPagination -->
    <%= partial :paginate %>
    <table id="hostnode-list" class="table table-striped table-bordered">
      <thead>
        <tr>
          <th>ホストノードID</th>
          <th>ホストノード名</th>
          <th>状態</th>
          <th>ハイパーバイザ</th>
          <th>CPUコア</th>
          <th>メモリサイズ</th>
          <th>インスタンス情報</th>
        </tr>
      </thead>
      <!--  The content is mapped on #resultItemTemplate -->
      <tbody id="content"></tbody>
      <script type="text/template" id="resultItemTemplate">
        <td><a href="/host_nodes/{{ uuid }}">{{ uuid }}</a></td>
        <td>{% if(! _.isNull(display_name)){ %}{{ display_name }}{% } %}</td>
        <td>{{ status }}</td>
        <td>{{ hypervisor }}</td>
        <td>{{ offering_cpu_cores }}</td>
        <td>{% if(! _.isEmpty(id)){ %}{{ offering_memory_size }}MB{% } %}</td>
        <td>{% if(! _.isEmpty(id)){ %}<a href="/instances?host_node_id={{ uuid }}">インスタンス情報</a>{% } %}</td>
      </script>
    </table>
</div>
